import {App, Component} from 'vue'
import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import {
    ElAffix,
    ElSkeleton,
    ElHeader,
    ElAside,
    ElMain,
    ElFooter,
    ElContainer,
    ElBreadcrumb,
    ElBreadcrumbItem,
    ElScrollbar,
    ElSubMenu,
    ElButton,
    ElCol,
    ElRow,
    ElSpace,
    ElDivider,
    ElCard,
    ElDropdown,
    ElDialog,
    ElMenu,
    ElMenuItem,
    ElDropdownItem,
    ElDropdownMenu,
    ElTabs,
    ElTransfer,
    ElTabPane,
    ElIcon,
    ElInput,
    ElForm,
    ElFormItem,
    ElSwitch,
    ElSelect,
    ElOption,
    ElLoading,
    ElPopover,
    ElPopper,
    ElTag,
    ElTooltip,
    ElDrawer,
    ElPagination,
    ElAlert,
    ElRadioButton,
    ElRadioGroup,
    ElInfiniteScroll,
    ElDatePicker,
    ElTree,
    ElConfigProvider,
    ElStep,
    ElSteps,
    ElInputNumber,
    ElTimePicker,
    ElCollapse,
    ElCollapseItem,
    ElCheckbox,
    ElCheckboxGroup,
    ElRadio,
    ElSlider,
    ElOptionGroup,
    ElProgress
} from 'element-plus'

const components = [
    ElAffix,
    ElSkeleton,
    ElHeader,
    ElAside,
    ElMain,
    ElFooter,
    ElContainer,
    ElBreadcrumb,
    ElBreadcrumbItem,
    ElScrollbar,
    ElSubMenu,
    ElButton,
    ElCol,
    ElRow,
    ElSpace,
    ElDivider,
    ElCard,
    ElDropdown,
    ElDialog,
    ElMenu,
    ElMenuItem,
    ElDropdownItem,
    ElDropdownMenu,
    ElTabs,
    ElTransfer,
    ElTabPane,
    ElIcon,
    ElInput,
    ElForm,
    ElFormItem,
    ElSwitch,
    ElSelect,
    ElOption,
    ElPopover,
    ElPopper,
    ElTag,
    ElTooltip,
    ElDrawer,
    ElPagination,
    ElAlert,
    ElRadioButton,
    ElRadioGroup,
    ElDatePicker,
    ElTree,
    ElConfigProvider,
    ElStep,
    ElSteps,
    ElInputNumber,
    ElTimePicker,
    ElCollapse,
    ElCollapseItem,
    ElCheckbox,
    ElCheckboxGroup,
    ElRadio,
    ElSlider,
    ElOptionGroup,
    ElProgress
]

const plugins = [ElLoading, ElInfiniteScroll]

export function setupElementPlus(app: App) {
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
        app.component(key, component)
    }
    components.forEach((component: Component) => {
        app.component(component.name!, component)
    })
    plugins.forEach((plugin) => {
        app.use(plugin)
    })
}
